<template>
  <el-dialog
    :title="title"
    width="90%"
    :visible.sync="showModal"
    @close="closeDialog"
  >
    <el-form ref="form" :model="form" :rules="rules" label-width="auto">
      <el-row :gutter="20" style="flex-wrap: wrap" type="flex">
        <el-col :span="8">
          <el-form-item label="外径" prop="outerDiamete">
            <template v-if="pageType == 'view'">
              {{ form.outerDiamete }}
            </template>
            <el-input v-else v-model.trim="form.outerDiamete" maxlength="3" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="壁厚" prop="wallThickness">
            <template v-if="pageType == 'view'">
              {{ form.wallThickness }}
            </template>
            <el-input v-else v-model.trim="form.wallThickness" maxlength="22" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="支数" prop="count">
            <template v-if="pageType == 'view'">
              {{ form.count }}
            </template>
            <el-input v-else v-model.trim="form.count" maxlength="60" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="长度" prop="length">
            <template v-if="pageType == 'view'">
              {{ form.length }}
            </template>
            <el-input v-else v-model.trim="form.length" maxlength="20" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试验压力" prop="testPressure">
            <template v-if="pageType == 'view'">
              {{ form.testPressure }}
            </template>
            <el-input v-else v-model.trim="form.testPressure" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="稳压时间" prop="pressureHoldingTime">
            <template v-if="pageType == 'view'">
              {{ form.pressureHoldingTime }}
            </template>
            <el-input
              v-else
              v-model.trim="form.pressureHoldingTime"
              maxlength="40"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试验结果" prop="experimentalResults">
            <template v-if="pageType == 'view'">
              {{ form.experimentalResults }}
            </template>
            <el-input
              v-else
              v-model.trim="form.experimentalResults"
              maxlength="40"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="稳压时间" prop="pressureHoldingTime">
            <template v-if="pageType == 'view'">
              {{ form.pressureHoldingTime }}
            </template>
            <el-input
              v-else
              v-model.trim="form.pressureHoldingTime"
              maxlength="40"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="涡探" prop="vortexLeaned">
            <template v-if="pageType == 'view'">
              {{ form.vortexLeaned }}
            </template>
            <el-input v-else v-model.trim="form.vortexLeaned" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="超探" prop="superAgent">
            <template v-if="pageType == 'view'">
              {{ form.superAgent }}
            </template>
            <el-input v-else v-model.trim="form.superAgent" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="稳压时间" prop="pressureHoldingTime">
            <template v-if="pageType == 'view'">
              {{ form.pressureHoldingTime }}
            </template>
            <el-input
              v-else
              v-model.trim="form.pressureHoldingTime"
              maxlength="40"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试样尺寸E3" prop="specimenSize">
            <template v-if="pageType == 'view'">
              {{ form.specimenSize }}
            </template>
            <el-input v-else v-model.trim="form.specimenSize" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试验温度（℃）" prop="testTemperature">
            <template v-if="pageType == 'view'">
              {{ form.testTemperature }}
            </template>
            <el-input
              v-else
              v-model.trim="form.testTemperature"
              maxlength="40"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试样号" prop="sampleNumber">
            <template v-if="pageType == 'view'">
              {{ form.sampleNumber }}
            </template>
            <el-input v-else v-model.trim="form.sampleNumber" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="抗拉强度T.S" prop="ts">
            <template v-if="pageType == 'view'">
              {{ form.ts }}
            </template>
            <el-input v-else v-model.trim="form.ts" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="屈服强度Y.S" prop="ys">
            <template v-if="pageType == 'view'">
              {{ form.ys }}
            </template>
            <el-input v-else v-model.trim="form.ys" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="延伸率EL" prop="el">
            <template v-if="pageType == 'view'">
              {{ form.el }}
            </template>
            <el-input v-else v-model.trim="form.el" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="收缩Z(%)" prop="z">
            <template v-if="pageType == 'view'">
              {{ form.z }}
            </template>
            <el-input v-else v-model.trim="form.z" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="扩口" prop="spinOver">
            <template v-if="pageType == 'view'">
              {{ form.spinOver }}
            </template>
            <el-input v-else v-model.trim="form.spinOver" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="压扁" prop="flaser">
            <template v-if="pageType == 'view'">
              {{ form.flaser }}
            </template>
            <el-input v-else v-model.trim="form.flaser" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="弯曲" prop="curve">
            <template v-if="pageType == 'view'">
              {{ form.curve }}
            </template>
            <el-input v-else v-model.trim="form.curve" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="布氏" prop="bh">
            <template v-if="pageType == 'view'">
              {{ form.bh }}
            </template>
            <el-input v-else v-model.trim="form.bh" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="洛氏" prop="hrc">
            <template v-if="pageType == 'view'">
              {{ form.hrc }}
            </template>
            <el-input v-else v-model.trim="form.hrc" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="晶粒度" prop="grainSize">
            <template v-if="pageType == 'view'">
              {{ form.grainSize }}
            </template>
            <el-input v-else v-model.trim="form.grainSize" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="显微组织" prop="microstructural">
            <template v-if="pageType == 'view'">
              {{ form.microstructural }}
            </template>
            <el-input
              v-else
              v-model.trim="form.microstructural"
              maxlength="40"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="A 粗/细" prop="niA">
            <template v-if="pageType == 'view'">
              {{ form.niA }}
            </template>
            <el-input v-else v-model.trim="form.niA" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="B 粗/细" prop="z">
            <template v-if="pageType == 'view'">
              {{ form.niB }}
            </template>
            <el-input v-else v-model.trim="form.niB" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="C 粗/细" prop="niC">
            <template v-if="pageType == 'view'">
              {{ form.niC }}
            </template>
            <el-input v-else v-model.trim="form.niC" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="D 粗/细" prop="niD">
            <template v-if="pageType == 'view'">
              {{ form.niD }}
            </template>
            <el-input v-else v-model.trim="form.niD" maxlength="40" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="DS" prop="niDs">
            <template v-if="pageType == 'view'">
              {{ form.niDs }}
            </template>
            <el-input v-else v-model.trim="form.niDs" maxlength="40" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span v-if="pageType != 'view'" slot="footer" class="dialog-footer">
      <el-button @click="showModal = false">导 入</el-button>
      <el-button @click="showModal = false">取 消</el-button>
      <el-button type="primary" @click="add">提 交</el-button>
    </span>
  </el-dialog>
</template>
  <script>
import { deepClone } from '@/utils/index'
export default {
  data() {
    return {
      pageType: null, // 页面类型 编辑 还是新增
      title: null,
      showModal: false,
      flags: [
        {
          value: '1',
          label: '是',
        },
        {
          value: '0',
          label: '否',
        },
      ],
      tableData: {
        column: [
          {
            label: '化学成分（%）',
            align: 'center',
            children: [
              //C	S	Mn	Si	P 	Cr	Ni	Cu	Mo	V	Ti	Al	Nb	W	N	B	As	Sn	Zr	Pb	Bi	Sb				Cr+Cu+Mo+Ni				Cu+6Sn	Al+Ti/2		Ceq
              { prop: 'C', label: 'C', width: 50, align: 'center' },
              { prop: 'S', label: 'S', width: 50, align: 'center' },
              { prop: 'Si', label: 'Si', width: 50, align: 'center' },
              { prop: 'P', label: 'P', width: 50, align: 'center' },
              { prop: 'Cr', label: 'Cr', width: 50, align: 'center' },
              { prop: 'Ni', label: 'Ni', width: 50, align: 'center' },
              { prop: 'Cu', label: 'Cu', width: 50, align: 'center' },
              { prop: 'Mo', label: 'Mo', width: 50, align: 'center' },
              { prop: 'V', label: 'V', width: 50, align: 'center' },
              { prop: 'Ti', label: 'Ti', width: 50, align: 'center' },
              { prop: 'Al', label: 'Al', width: 50, align: 'center' },
              { prop: 'Nb', label: 'Nb', width: 50, align: 'center' },
              { prop: 'W', label: 'W', width: 50, align: 'center' },
              { prop: 'N', label: 'N', width: 50, align: 'center' },
              { prop: 'B', label: 'B', width: 50, align: 'center' },
              { prop: 'As', label: 'As', width: 50, align: 'center' },
              { prop: 'Sn', label: 'Sn', width: 50, align: 'center' },
              { prop: 'Zr', label: 'Zr', width: 50, align: 'center' },
              { prop: 'Pb', label: 'Pb', width: 50, align: 'center' },
              { prop: 'Bi', label: 'Bi', width: 50, align: 'center' },
              { prop: 'Sb', label: 'Sb', width: 50, align: 'center' },
              { prop: 'ccmn', label: 'Cr+Cu+Mo+Ni', align: 'center' },
              { prop: 'c6', label: 'Cu+6Sn', align: 'center' },
              { prop: 'at', label: 'Al+Ti/2', align: 'center' },
              { prop: 'ceq', label: 'Ceq', align: 'center' },
            ],
          },
        ],
        data: [
          {
            C: '1',
            S: '1',
            Si: '1',
            P: '1',
            Cr: '1',
            Ni: '1',
            Cu: '1',
            Mo: '',
            V: '',
            Ti: '',
            Al: '',
            Nb: '',
            W: '',
            N: '',
            B: '',
            As: '',
            Sn: '',
            Zr: '',
            Pb: '',
            Bi: '',
            Sb: '',
            ccmn: '',
            c6: '',
            at: '',
            ceq: '',
          },
        ],
      },
      form: {
        package: null,
        steel: null,
        batch: null,
        outerDiamete: null,
        wallThickness: null,
        count: null,
        length: null,
        weight: null,
        testPressure: null,
        pressureHoldingTime: null,
        experimentalResults: null,
        vortexLeaned: null,
        superAgent: null,
        specimenSize: null,
        testTemperature: null,
        sampleNumber: null,
        ts: null,
        ys: null,
        el: null,
        z: null,
        spinOver: null,
        flaser: null,
        curve: null,
        bh: null,
        hrc: null,
        grainSize: null,
        microstructural: null,
        niA: null,
        niB: null,
        niC: null,
        niD: null,
        niDs: null,
        me1: null,
        me2: null,
        me3: null,
        me4: null,
        me5: null,
        me6: null,
        heatNo: null,
        C: '',
        S: '',
        Si: '',
        P: '',
        Cr: '',
        Ni: '',
        Cu: '',
        Mo: '',
        V: '',
        Ti: '',
        Al: '',
        Nb: '',
        W: '',
        N: '',
        B: '',
        As: '',
        Sn: '',
        Zr: '',
        Pb: '',
        Bi: '',
        Sb: '',
        ccmn: '',
        c6: '',
        at: '',
        ceq: '',
      },
      difficultylevelOptions: [
        {
          name: '测试',
          value: '1',
        },
      ],
      rules: {
        archiveFlag: [{ required: true, message: '请输入', trigger: 'change' }],
        userNum: [{ required: true, message: '请输入', trigger: 'blur' }],
        countryNameAbbr: [
          { required: true, message: '请输入', trigger: 'blur' },
        ],
        chineseUserName: [
          { required: true, message: '请输入', trigger: 'blur' },
        ],
        chineseUsnmAbbr: [
          { required: true, message: '请输入', trigger: 'blur' },
        ],
        userCategory: [
          { required: true, message: '请输入', trigger: 'change' },
        ],
        taxNum: [{ required: true, message: '请输入', trigger: 'blur' }],
        taxNumAdd: [{ required: true, message: '请输入', trigger: 'blur' }],
        officeAddr: [{ required: true, message: '请输入', trigger: 'blur' }],
        addrRegst: [{ required: true, message: '请输入', trigger: 'blur' }],
      },
    }
  },
  methods: {
    closeDialog() {
      this.showModal = false
    },
    renderText(type, code) {
      if (!(type && code)) {
        return
      }
      for (const item in type) {
        if (type[item].value == code) {
          return type[item].name
        }
      }
    },
    show(parms) {
      this.showModal = true
      this.pageType = parms.type
      this.$nextTick(() => {
        this.title = parms.title
        this.init()
        if (parms.type != 'add') {
          // 填充数据
          this.fillData(parms.data)
        }
      })
    },
    add() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.regroupFormData()
        }
      })
    },
    // 组合数据
    regroupFormData() {
      const data = deepClone(this.form)
      this.$emit('appendData', data)
    },
    fillData(data) {
      this.form = data
    },
    init() {
      this.options = []
      this.form = {
        addrRegst: null,
        archiveFlag: null,
        cancelMark: null,
        chineseUserName: null,
        chineseUsnmAbbr: null,
        cnsgUserAdd: null,
        cnsgUserRelaNo: null,
        companyFlag: null,
        corpCode: null,
        countryNameAbbr: null,
        dunBrand: null,
        englishUserName: null,
        englishUsnmAbbr: null,
        lastUpdateId: null,
        lastUpdatePerson: null,
        lastUpdateTime: null,
        officeAddr: null,
        orgCode: null,
        relationMark: null,
        remarkDscr: null,
        stratagemMark: null,
        taxMode: null,
        taxNum: null,
        taxNumAdd: null,
        trade: null,
        userCategory: null,
        userLastAccnSeqNo: null,
        userLastAddrSeqNo: null,
        userNum: null,
        userRelaNo: null,
        userType: null,
      }
      this.$refs.form.resetFields()
    },
  },
}
</script>
